<template>
  <div class="release_list">
    <div class="examine_title">预警审核</div>
    <div class="examine">
      <div class="refresh">刷新</div>
      <div class="tab">
        <el-table :data="tableData1" style="width: 100%">
          <el-table-column prop="date" label="时间" width="80">
          </el-table-column>
          <el-table-column prop="times" label="时次" width="80">
          </el-table-column>
          <el-table-column prop="type" label="类型">
          </el-table-column>
          <el-table-column prop="state" label="审核状态">
          </el-table-column>
          <el-table-column prop="idea" label="审核意见">
          </el-table-column>
          <el-table-column prop="blue" label="蓝色">
          </el-table-column>
          <el-table-column prop="yellow" label="黄色">
          </el-table-column>
          <el-table-column prop="orange" label="橙色">
          </el-table-column>
          <el-table-column prop="red" label="红色">
          </el-table-column>
        </el-table>
      </div>
    </div>
    <div class="publish_title">预警发布</div>
    <div class="publish">
      <el-button>预警发布</el-button>
    </div>
    <div class="before_title">待生成产品</div>
    <div class="before">
      <div class="tab">
        <el-table :data="tableData2" style="width: 100%">
          <el-table-column prop="date" label="时间" width="80">
          </el-table-column>
          <el-table-column prop="times" label="时次" width="80">
          </el-table-column>
          <el-table-column prop="type" label="类型">
          </el-table-column>
          <el-table-column prop="creater" label="制作人">
          </el-table-column>
          <el-table-column prop="examer" label="审核人">
          </el-table-column>
          <el-table-column prop="publisher" label="发布人">
          </el-table-column>
        </el-table>
      </div>
      <div class="select">
        <span>地理信息</span>
        <el-select v-model="value" placeholder="请选择">
          <el-option v-for="item in option" :key="item.value" :label="item.label" :value="item.value">
          </el-option>
        </el-select>
      </div>
      <div class="check">
        <div class="check1">
          <el-checkbox v-model="checked1"></el-checkbox>
          <span>是否附图</span>
        </div>
        <div class="check2">
          <el-checkbox v-model="checked2"></el-checkbox>
          <span>是否附表</span>
        </div>
      </div>
      <el-button>生成产品</el-button>
    </div>
    <div class="editor_title">模板编辑</div>
    <div class="editor">
      <el-button>预警模板</el-button>
    </div>
  </div>
</template>
<script>
export default {
  data() {
    return {
      tableData1: [{
        date: '',
        times: '',
        type: '',
        state: '',
        idea: '',
        blue: '',
        yellow: '',
        orange: '',
        red: '',
      }],
      tableData2: [{
        date: '',
        times: '',
        type: '',
        creater: '',
        examer: '',
        publisher: '',
      }],
      option: [{
        value: '选项1',
        label: ''
      }],
      value: '选项1',
      checked1:true,
      checked2:false,
    }
  }
}
</script>
<style scoped lang="less">
.release_list{
  width: 100%;
  height: 100%;
  font-size: 12px;
  padding-right: 10px;
  box-sizing: border-box;
}
.release_list .examine{
  width: 100%;
  border: 1px solid;
  display: flex;
  flex-direction: column;
  align-items: end;
  .refresh{
    margin: 10px 20px 10px 0;
  }
  .tab{
    width: 100%;
    height: 150px;
  }
}
.release_list .publish{
  width: 100%;
  border: 1px solid;
  display: flex;
  justify-content: center;
  .el-button{
    margin: 10px 0;
  }
}
.release_list .before{
  width: 100%;
  border: 1px solid;
  display: flex;
  flex-direction: column;
  align-items: center;
  .tab{
    width: 100%;
    height: 150px;
    margin-bottom: 5px;
  }
  .select{
    width: 100%;
    border: 1px solid;
    height: 50px;
    display: flex;
    justify-content: center;
    align-items: center;
    span{
      margin-right: 20px;
    }
  }
  .check{
    width: 200px;
    display: flex;
    justify-content: space-between;
    margin: 10px 0;
  }
  .el-button{
    margin-bottom: 10px;
  }
}
.release_list .editor{
  width: 100%;
  border: 1px solid;
  height: 50px;
  display: flex;
  justify-content: center;
  align-items: center;
}
</style>
